.icon {
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
}

@theme-color: #55B761;
@font-color: #3E3E3E;

section {
    .right-btn {
        float: right;
        padding-left: 2rem;
        padding-right: 2rem;
        margin-top: 0.5rem;
        border: 1px solid #D6D6D6;
        border-radius: 8px;
    }

    &>div {
        width: 50%;

        @media (max-width:1200px) {
            width: 60%;
        }

        @media (max-width:992px) {
            width: 70%;
        }

        @media (max-width:768px) {
            width: 85%;
        }

        margin: 0 auto;

        h1 {
            width: 30%;

            img {
                width: 100%;
            }
        }

        .middle {
            // height: 400px;

            i {
                background-color: #CCCCCC;
                width: 100%;
                height: 1px;
            }

            .form-group {
                

                .agree-txt {
                    cursor: pointer;

                    @media (max-width:768px) {
                        p {
                            vertical-align: super;
                        }

                        label {
                            width: 85%;
                        }
                    }
                }

                .checkbox {
                    display: inline-block;
                    width: 0.8rem;
                    height: 0.8rem;
                    background-color: white;
                    border: 1px solid #CCCCCC;
                    border-radius: 3px;
                    position: relative;
                }

                // .checkbox::after {
                //     content: '';
                //     position: absolute;
                //     left: 1px;
                //     top: -1px;
                //     width: 0.8rem;
                //     height: 0.8rem;
                //     display: block;
                //     background: url('../images/checkmark.png') no-repeat center;
                // }

                .checkbox1 {
                    position: absolute;
                    left: 1px;
                    top: -1px;
                    width: 0.8rem;
                    height: 0.8rem;
                    display: inline-block;
                    background: url('../images/checkmark.png') no-repeat center;
                }

                small {
                    color: #B6B6B6;

                    a {
                        color: #B6B6B6;
                        text-decoration: underline;
                    }
                }

                input {
                    border: 1px solid white;
                    background-color: #F8F8F8;
                    padding: 1.3rem 0 1.3rem 1.5rem;
                    border-radius: 8px;

                    &.form-control {
                        &:focus {
                            border: 1px solid white;
                            //   webkit-box-shadow:none;
                            box-shadow: none;
                        }
                    }
                }

            }

            .btn-sign,
            .btn-signUp {
                width: 100%;
                line-height: 1.7rem;
                border-radius: 0.6rem;
            }

            .txt-or {
                line-height: 3.5rem;
                margin-bottom: 0;
                color: #666666;
            }

            .btn-sign {
                color: white;
                background-color: #59be7b;

                &:hover {
                    background-color: @theme-color;
                }
            }

            .btn-signUp {
                color: #666666;
                border: 1px solid #d6d6d6;

                u {
                    vertical-align: middle;
                    width: 20px;
                    height: 20px;
                    margin-right: 10px;
                    background: url('../images/btn_google_sign_in.png') no-repeat center/cover;
                }
            }
        }
    }

}